<template>


 <van-list
    v-model="loading"
    :finished="finished"
    finished-text="没有更多了"
    @load="onLoad"
  >
     <ul class="album">
        <li
        v-for="item in list" :key="item.id"
        >
          <a
          :href="`#${item.url}`"
          >
            <j-item
            :id="item.id"
            :img="item.img"
            :title="item.title"
         
            :countInfo="item.countInfo"
            :categoryName="item.categoryName"
            :salePoint="item.salePoint"
            ><img :src="item.img" alt=""></j-item>
          </a>
          
        </li>
      </ul>
       <template #loading>
        <div class="loading">
          <van-loading color="#ff1e00" type="spinner" />
         
          
        </div>
      </template>
       </van-list>
</template>

<script>
import { initZbAlbumListlData } from "@/request/api.js";
export default {

    data(){
      return{
        anchorid:0,
        list:[],
        loading: true,
      finished: false,
      page:1,
      }
    },
    props:{
        // anchorid:{
        //     type:Number
        // }
    },
    created(){
      this.anchorid = this.$route.params.id
      console.log(this.anchorid)
      this.initData()
    },
    methods:{
       async initData(){
         let list = []
        let params  = {
          anchorId:this.anchorid,
          page:this.page,
          pageSize:20,
          asc:false
        }
        
        let {data:res} = await  initZbAlbumListlData(params)

        console.log("主播更多专辑", res)

        res.data.albumBriefDetailInfos.forEach(item=>{
          let obj = {
            id:item.id,
            img:"https://imagev2.xmcdn.com/" + item.albumInfo.cover,
            title:item.albumInfo.title,
            salePoint:item.albumInfo.salePoint,
            countInfo:item.statCountInfo,
            url:item.pageUriInfo.url,
            categoryName:item.pageUriInfo.categoryName,
          }

          list.push(obj)
        })

        this.list.push(...list)

        this.loading = false

        if(list.length == 0){
          this.finished = true
        }
        
       },

      onLoad(){
        this.page++
        this.initData()
      }
    }
}
</script>

<style lang="scss" scoped>
.album,.shengyin,.book {
        padding-left: 15px;
      li {
        border-bottom: 1px solid #f3f4f5;
        a {
          display: block;
        }
      }
    }
</style>

